<!DOCTYPE html>
<!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!-->
<html lang="en">
<!--<![endif]-->
<!-- BEGIN HEAD -->
<head>
    <meta charset="utf-8" />
    <title></title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="width=device-width, initial-scale=1" name="viewport" />
    <meta content="" name="description" />
    <meta content="" name="author" />
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="http://tv.speechb.com/lib/superui/content/ui/global/bootstrap/css/bootstrap.min.css">
    <!-- Font Awesome -->
    <link href="http://tv.speechb.com/lib/superui/content/ui/global/font-awesome/css/font-awesome.css" rel="stylesheet" />
    <!-- Theme style -->
    <link rel="stylesheet" href="http://tv.speechb.com/lib/superui/content/adminlte/dist/css/AdminLTE.css">
    <link rel="stylesheet" href="http://tv.speechb.com/lib/content/adminlte/dist/css/skins/_all-skins.min.css">
    <link href="http://tv.speechb.com/lib/superui/content/min/css/supershopui.common.min.css" rel="stylesheet" />
    <link href="http://tv.speechb.com/lib/superui/content/plugins/bootstrap-table/bootstrap-table.css" rel="stylesheet" />
    <link href="http://tv.speechb.com/lib/superui/content/layx/layx.min.css" rel="stylesheet" />
    <link href="http://tv.speechb.com/lib/x-editable/css/select2-bootstrap.css" rel="stylesheet"/>
    <link href="http://tv.speechb.com/lib/select2/css/select2.min.css" rel="stylesheet"/>
    <!--全局通用框架样式 end-->
</head>
<body>
<!--
<script id="editor" type="text/plain" style="height: 150px;"/>
-->
<!-- Main content -->
    <div class="content">
        <div class="box box-info">
            <h4 class="box-header with-border" >添加菜单</h4>
        </div>
        <div class="form-horizontal content" style="margin-top: 10px;max-width: 640px">
            <div class="box-body" style="max-width: 640px">
                <div class="form-group">
                    <label for="menu" class="col-sm-2 control-label">菜单名</label>
                    <div class="col-sm-10">
                        <input id="menu" type="text" class="form-control" placeholder="请输入菜单名">
                    </div>
                </div>
                <div class="form-group">
                    <label for="icon" class="col-sm-2 control-label">图标</label>
                    <div class="col-sm-10">
                        <input id="icon" type="text" class="form-control" value="fa fa-circle-o" placeholder="请输入图标">
                    </div>
                </div>
                <div class="form-group">
                    <label for="url" class="col-sm-2 control-label">链接</label>
                    <div class="col-sm-10">
                        <input id="url" type="text" class="form-control" placeholder="请输入链接">
                    </div>
                </div>
                <div class="form-group">
                    <label for="targetType" class="col-sm-2 control-label">跳转模式</label>
                    <div class="col-sm-10">
                        <input id="targetType" type="text" class="form-control" value="iframe-tab" placeholder="请输入跳转模式">
                    </div>
                </div>
                <div class="form-group">
                    <label for="sort" class="col-sm-2 control-label">排序</label>
                    <div class="col-sm-10">
                        <input id="sort" type="text" class="form-control" placeholder="请输入排序">
                    </div>
                </div>

                <div class="form-group">
                    <label for="menu_select" class="col-sm-2 control-label">父ID</label>
                    <div class="col-sm-10">
                        <select id="menu_select" name="parentid" class="form-control">
                            <option selected="selected" value="0">--请选择--</option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
    </div>

<button id="submitBtn" type="button" class="btn btn-primary center-block" style="margin-top:10px"> 添加标题</button>

<script src="http://tv.speechb.com/lib/superui/content/ui/global/jQuery/jquery.min.js"></script>

<!-- Bootstrap 3.3.6 -->
<script src="http://tv.speechb.com/lib/superui/content/ui/global/bootstrap/js/bootstrap.min.js"></script>
<script src="http://tv.speechb.com/lib/select2/js/select2.full.min.js"></script>
<script src="http://tv.speechb.com/lib/superui/content/min/js/supershopui.common.js"></script>
<!--富文本框-->
<script type="text/javascript" charset="utf-8" src="http://tv.speechb.com/lib/toaster/jquery.toaster.js"></script>

<script type="text/javascript">

    $(function () {
        $(".select2").select2();

        function initSelect2(id, url) {
            $(id).select2({
                language: "zh-CN",// 指定语言为中午，国际化才能起效
                inputMessage: "请选择",
                pagination: {
                    more: true
                },
                ajax: {
                    url: url,
                    dataType: 'json',
                    delay: 250, // 延迟显示
                    data: function (params) {
                        var query = {
                            search: params.term,
                            page: params.page || 1,
                            rows: 10 //每页显示多少行
                        }
                        return query;
                    },
                    processResults: function (data, params) {
                        params.page = params.page | 1;
                        return {
                            results: data.data,// 后台返回数据
                            pagination: {
                                more: (params.page - 1) * 10 < data.total// 总数
                            }
                        };
                    },
                    cache: false
                },
                escapeMarkup: function (markup) {
                    return markup;
                },
                minimumInputLength: 0,// 0长度及搜索所以
                templateResult: function (repo) {// 显示的结果集格式，需要自己写CSS
                    // 正在检索
                    if (repo.loading) return repo.text;
                    var markup = repo.text;
                    var markup = "";
                    markup += "<div class ='select2-result-repository_statistics'>"
                        + "<div class='select2-result-repository_forks'><i class = 'fa fa-bolt'></i> &nbsp;" + repo.text + "</div>"
                        + "</div>";
                    return markup;
                },
                templateSelection: function (repo) {
                    // 选中某一列后文本框
                    return "<div>" + repo.text || repo.id + "</div>";
                },
                placeholder: '请选择'
            });
        }

        function initTitle1() {
            initSelect2("#menu_select", "/admin/sys_menu/select");
            $("#menu_select").off().on("change", function () {
                var data = $(this).val();
                $.ajax({
                    type: "GET",
                    url: "/admin/sys_menu/sorting",
                    data: {
                        "id": data
                    },
                    success: function (result) {
                        if (result.code == 1) {
                            $("#sort").val(result.data);
                            $.toaster({priority: "success", title: "通知", message: "自动生成排序成功"});
                        } else {
                            $.toaster({priority: "danger", title: "通知", message: "自动生成排序失败"})
                        }
                    },
                    error: function (e) {
                        $.toaster({priority: "danger", title: "通知", message: "自动生成排序失败"})
                    }
                });

            });
            $("#menu_select").append(new Option("--请选择标题--", 0, true, true));//第一个参数时id,第二个参数是text
            $("#menu_select").trigger("change");
        }

        initTitle1();
        $("#submitBtn").click(function () {
            var menu = $("#menu").val();
            var icon = $("#icon").val();
            var url = $("#url").val();
            var targetType = $("#targetType").val();
            var sort = $("#sort").val();
            var menu_select = $("#menu_select").val();
            $.ajax({
                type: "POST",
                url: "/admin/sys_menu/add",
                data: {
                    "menu": menu,
                    "icon": icon,
                    "url": url,
                    "targetType": targetType,
                    "sort": sort,
                    "menu_select": menu_select
                },
                success: function (result) {
                    if (result.code == 1) {
                        $("#menu").val("");
                        $.toaster({priority: "success", title: "通知", message: "发布成功"});
                    } else {
                        $.toaster({priority: "danger", title: "通知", message: "发布失败"})
                    }
                },
                error: function (e) {
                    $.toaster({priority: "danger", title: "通知", message: "发布失败"})
                }
            });
        });
        $("#publish_type").select2();
    });

</script>
</body>

</html>